const path = require('path')

// 因为需要开启webpack hot 导入webpack

const webpack = require('webpack')
//需要用到html-webpack-plugin ，导入
const htmlWebpackPlugin = require('html-webpack-plugin')

//模块导出命令
module.exports = {
    //入口文件
    // mode: 'development',
    entry : path.join(__dirname , './src/main.js'),
    output :{
        filename : 'bundle.js',
        path : path.join(__dirname ,'./dist'), 
    },
    devServer:{
        open : true,
        port : 8889,
        // contentBase : 'src',  //在进行了html-webpack-plugin后，就无需访问src中的index.html 因为在网站根目录 这个插件已经生成了一个内存中的index.html
        hot : true, //仅仅打开hot无效   第一步
        // host: '192.168.137.1'
    },
    plugins:[
        new webpack.HotModuleReplacementPlugin(),  //new 一个热更新的对象
        new htmlWebpackPlugin({
            template: path.join(__dirname,'./src/index.html'),
            filename:'index.html'
        })
    ],
    module:{
        rules:[
            {test: /\.css$/,use:['style-loader','css-loader']}, //配置处理.css 文件的模块
            {test: /\.less$/,use:['style-loader','css-loader','less-loader']}, //配置处理.less 文件的模块
            {test: /\.scss$/,use:['style-loader','css-loader','sass-loader']}, //配置处理.scss 文件的模块
            {test:/\.(jpg|png|bmp|jpeg|gif)$/,use:'url-loader?limit=6000&name=[hash:8]-[name].[ext]'}, //处理css中引入的图片
            {test:/\.(eot|svg|ttf|woff|woff2)/,use:'url-loader'},//处理字体文件
            {test:/\.js$/,use:'babel-loader',exclude:/node_modules/},//处理es6语法，并排除node_modules包
            {test:/\.vue$/,use:'vue-loader'}, //处理vue后缀的文件
            //处理preview的文件
            // {test:/vue-preview.src.*?js$/,use:'babel-loader',exclude:/node_modules/}
        ]    
    },
    // resolve:{
    //     alias:{
    //         "vue$":"vue/dist/vue.js"
    //     }
    // }
}